import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:loxen/utils/config.dart';
import 'package:provider/provider.dart';

//文本输入框
class ClearTextField extends StatefulWidget {
  final TextEditingController myController = TextEditingController();
  final FocusNode myNode = FocusNode();
  final Widget expandButton;

  final List<TextInputFormatter> inputFormatters;

  //下一个输入框
  final FocusNode next;

  //内容样式
  final TextStyle inputStyle;

  //键盘回车样式
  final TextInputAction action;

  //异常文本
  final String errorMessage;

  //异常文本样式
  final TextStyle errorStyle;

  //提示文本信息
  final String hint;

  //提示文本样式
  final TextStyle hintStyle;

  //清楚按钮图标
  final Widget clear;

  //是否是密码
  final bool isPassword;

  //键盘回车回调
  final Function onClick;

  final TextInputType keyboardType;

  ClearTextField({
    Key key,
    this.next,
    this.inputStyle,
    this.action,
    this.errorMessage,
    this.errorStyle,
    this.hint,
    this.hintStyle,
    this.clear,
    this.isPassword = false,
    this.onClick,
    this.expandButton,
    this.inputFormatters,
    this.keyboardType,
  }) : super(key: key);

  @override
  _ClearTextFieldState createState() => _ClearTextFieldState();
}

class _ClearTextFieldState extends State<ClearTextField> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    print('ClearTextField 绘制');
    return ChangeNotifierProvider<_MyProvider>(
        create: (_) => _MyProvider(widget.myController),
        child: Consumer<_MyProvider>(builder: (_, model, __) {
          return Builder(
              builder: (context) => Stack(
                    alignment: Alignment.centerRight,
                    children: <Widget>[
                      TextField(
                          maxLines: 1,
                          autofocus: false,
                          focusNode: widget.myNode,
                          style: widget.inputStyle,
                          inputFormatters: widget.inputFormatters,
                          controller: widget.myController,
                          keyboardType: widget.keyboardType,
                          textInputAction: widget.action,
                          obscureText: widget.isPassword,
                          onEditingComplete: () {
                            if (widget.onClick != null) {
                              widget.onClick();
                            }
                          },
                          decoration: InputDecoration(
                            errorText: widget.errorMessage,
                            errorStyle: widget.errorStyle,
                            hintText: widget.hint,
                            hintStyle: widget.hintStyle,
                            counterText: '',
                          )),
                      Row(
                        mainAxisSize: MainAxisSize.min,
                        children: <Widget>[
                          model.show
                              ? SizedBox(
                                  height: 30,
                                  width: 30,
                                  child: InkWell(
                                    onTap: () {
                                      model.clear();
                                    },
                                    child: widget.clear,
                                  ))
                              : Constants.empty,
                          widget.expandButton ?? Constants.empty
                        ],
                      ),
                    ],
                  ));
        }));
  }
}

class _MyProvider extends ChangeNotifier {
  final TextEditingController controller;
  bool show = false;

  _MyProvider(this.controller) {
    init();
  }

  void clear() {
    controller.clear();
    show = false;
    notifyListeners();
  }

  void init() {
    controller.addListener(() {
      int len = controller.text.length;
      if (len > 0 && !show) {
        show = true;
        notifyListeners();
      }
    });
  }
}
